<template>
  <div class="daiban">
  <div class="p1"><p><i>&nbsp;</i> &nbsp;&nbsp;&nbsp;代办事项</p></div>
  <div class="div0">
    <div class="div1">
      <div  class="div1-1">12</div>
      <p>待付款订单</p>
    </div>
    <div class="div1">
      <div class="div1-2">12</div>
      <p>待确认订单</p>
    </div>
    <div class="div1">
      <div class="div1-3">14</div>
      <p>待回复客户</p>
    </div>
  </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
.div0{
  display: flex;
  justify-content: space-between;
  margin: 0 24px 30px 26px;
  .div1{
    width: 130px;
    div{
      width: 130px;
      height: 130px;
      text-align: center;
      line-height: 130px;
      font-size: 37px;
       background-repeat: no-repeat;
      background-position: right top;
    }
    p{
      font-size: 16px;
      text-align: center;
      font-weight: 700;
      margin-top: 10px;
    }
  }
}
.div1-1{
        background-image: url("../img/main-lanse.png"),url("../img/main-yuanquan.png");      
      }
      .div1-2{
        background-image: url("../img/main-hongse.png"),url("../img/main-yuanquan.png");
      }
      .div1-3{
        background-image: url("../img/main-huangse.png"),url("../img/main-yuanquan.png");
      }
.daiban{
  width: 590px;
  height: 250px;
  margin-right:20px ;
  background-color: #ffffff;
  overflow: hidden;
   .p1{
    margin-left: 24px;
    margin-right: 22px;
    margin-top: 24px;
    margin-bottom: 24px;
    font-size: 16px;
    color:#333;
    font-weight: 700;
    i{
      background-color: #438afe;
    }
  }
}
</style>